$.ajax({
	url: url + "/sys/index/getHistogramInfo",
	type: 'get',
	//		参数需转为字符串
	//data: JSON.stringify(d),
	//		json跨域
	dataType: 'json',
	contentType: "application/json",
	beforeSend: function(XMLHttpRequest) {
		XMLHttpRequest.setRequestHeader("X-Token", token); 
	},
	useDefaultXhrHeader: false,
	success: function(result) {
		console.log(result);
		if(result.code == '0') {
			var data = result.data;
			var data1 = [];
			var data2 = [];
			var data3 = [];
			var data4 = [];
			var data5 = [];
			var zx_time = [];
			for(var i in data) {
				data1.push(data[i].click);
				data2.push(data[i].clickRate);
				data3.push(data[i].cpc);
				data4.push(data[i].cpm);
				data5.push(data[i].view);
				zx_time.push(data[i].period);
			}
			kd(data1, data2, data3, data4, data5, zx_time);

		} else {
			isErr(result);
		}
	},
	err: function(err) {
		layer.msg("请求失败");
	}
});

function kd(data1, data2, data3, data4, data5, zx_time) {
	var myChart = echarts.init(document.getElementById('main'));

	var posList = [
		'left', 'right', 'top', 'bottom',
		'inside',
		'insideTop', 'insideLeft', 'insideRight', 'insideBottom',
		'insideTopLeft', 'insideTopRight', 'insideBottomLeft', 'insideBottomRight'
	];
	var app = {};
	app.configParameters = {
		rotate: {
			min: -90,
			max: 90
		},
		align: {
			options: {
				left: 'left',
				center: 'center',
				right: 'right'
			}
		},
		verticalAlign: {
			options: {
				top: 'top',
				middle: 'middle',
				bottom: 'bottom'
			}
		},
		position: {
			options: echarts.util.reduce(posList, function(map, pos) {
				map[pos] = pos;
				return map;
			}, {})
		},
		distance: {
			min: 0,
			max: 100
		}
	};

	app.config = {
		rotate: 90,
		align: 'left',
		verticalAlign: 'middle',
		position: 'insideBottom',
		distance: 15,
		onChange: function() {
			var labelOption = {
				normal: {
					rotate: app.config.rotate,
					align: app.config.align,
					verticalAlign: app.config.verticalAlign,
					position: app.config.position,
					distance: app.config.distance
				}
			};
			myChart.setOption({
				series: [{
					label: labelOption
				}, {
					label: labelOption
				}, {
					label: labelOption
				}, {
					label: labelOption
				}]
			});
		}
	};

	var labelOption = {
		normal: {
			show: false,
			position: app.config.position,
			distance: app.config.distance,
			align: app.config.align,
			verticalAlign: app.config.verticalAlign,
			rotate: app.config.rotate,
			formatter: '{name|{a}}',
			fontSize: 16,
			rich: {
				name: {
					textBorderColor: '#fff'
				}
			}
		}
	};
	option = {
		toolbox: {
			show: true,
			x: '100', // 水平安放位置，默认为全图右对齐，可选为：
			y: 'top', // 垂直安放位置，默认为全图顶端，可选为：
			
			showTitle: true,
			feature: {
				magicType: {
					show: true,
					
					type: ['line', 'bar']
				}
			}
		},
		color: ['#003366', '#006699', '#4cabce', '#e5323e', '#e5863e', '#a2374e'],
		tooltip: {
			trigger: 'axis',
			axisPointer: {
				type: 'shadow'
			}
		},
		legend: {
			data: ['点击量', '点击率', 'CPC', 'CPM', '曝光量', ]
		},

		calculable: true,
		xAxis: [{
			type: 'category',
			axisTick: { show: false },
			data: zx_time
		}],
		yAxis: [{
			//	            show: false,
			axisTick: { show: false },
			splitLine: { show: false },
		}],
		series: [{
				name: '点击量',
				type: 'bar',
				barGap: 0,
				label: labelOption,
				data: data1
			},
			{
				name: '点击率',
				type: 'bar',
				label: labelOption,
				data: data2
			},
			{
				name: 'CPC',
				type: 'bar',
				label: labelOption,
				data: data3
			},
			{
				name: 'CPM',
				type: 'bar',
				label: labelOption,
				data: data4
			},
			{
				name: '曝光量',
				type: 'bar',
				label: labelOption,
				data: data5
			},

		]
	};
	// 使用刚指定的配置项和数据显示图表。
	myChart.setOption(option);
}